<template>
  <div id="treminal">
    <div class="from_wrap">
      <el-form ref="form" class="treminal_from" label-width="150px">
        <el-form-item label="纳税人识别号：" style="margin-bottom: 12px !important">
          {{ billingFrom.taxpayerCode }}
        </el-form-item>
        <el-form-item label="设备类型：" required style="margin-bottom: 12px !important">
          <el-select size="small" v-model.trim="billingFrom.deviceType" placeholder="请选择设备类型">
            <el-option label="税控盘" :value="1"></el-option>
            <el-option label="金税盘" :value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="开票类型：" style="margin-bottom: 12px !important">
          <el-radio-group v-model="billingFrom.invoiceRequirements">
            <el-radio :label="4">增值税专用发票</el-radio>
            <el-radio :label="7">增值税普通发票</el-radio>
            <el-radio :label="26" style="margin-top: 10px">增值税电子发票</el-radio>
          </el-radio-group></el-form-item
        >
        <el-form-item label="税控盘编号：" required style="margin: 0 !important">
          <el-input size="small" v-model.trim="billingFrom.taxControlCode" placeholder="请输入税控盘编号"> </el-input>
        </el-form-item>
      </el-form>
      <el-form ref="form" class="treminal_from" label-width="150px">
        <el-form-item label="税控盘口令：" required style="margin-bottom: 12px !important">
          <el-input size="small" placeholder="请输入税控盘口令" v-model.trim="billingFrom.taxControlPwd"> </el-input>
        </el-form-item>

        <el-form-item label="税控数字证书密码：" required style="margin-bottom: 12px !important">
          <el-input
            size="small"
            placeholder="请输入税控数字证书密码"
            v-model.trim="billingFrom.taxControlCertificatePwd"
          >
          </el-input>
        </el-form-item>

        <el-form-item label="注册码：" required>
          <el-input size="small" placeholder="请输入注册码" v-model.trim="billingFrom.registrationCode"> </el-input>
        </el-form-item>
      </el-form>
    </div>

    <div class="footer">
      <el-button size="small" class="commonBtn" @click="closeBtn">取消</el-button>
      <el-button size="small" class="commonBtn1" @click="subBtn">确定</el-button>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    updateFrom: {
      type: Object
    }
  },
  data() {
    return {
      billingFrom: {
        taxpayerCode: '',
        taxControlCode: '',
        deviceType: '',
        invoiceHeaderId: '',
        invoiceRequirements: '',
        registrationCode: '',
        taxControlCertificatePwd: '',
        taxControlPwd: ''
      }
    }
  },
  mounted() {
    if (this.updateFrom && JSON.stringify(this.updateFrom) != '{}') {
      this.billingFrom.invoiceHeaderId = this.updateFrom.id
      this.billingFrom.taxpayerCode = this.updateFrom.taxpayerCode
    }
  },
  methods: {
    subBtn() {
      const keyArr = [
        { label: '请选择设备类型', value: 'deviceType' },
        { label: '请选择开票类型', value: 'invoiceRequirements' },
        { label: '请输入税控盘编号', value: 'taxControlCode' },
        { label: '请输入税控盘口令', value: 'taxControlPwd' },
        { label: '请输入税控数字证书密码', value: 'taxControlCertificatePwd' },
        { label: '请输入注册码', value: 'registrationCode' }
      ]
      let msg = ''
      for (let i = 0; i < keyArr.length; i++) {
        if (!this.billingFrom[keyArr[i].value]) {
          msg = keyArr[i].label
          break
        }
      }
      if (msg) {
        this.$message.error(msg)
        return
      }
      this.$https({
        method: 'post',
        url: '/invoiceTerminal/addInvoiceTerminal',
        data: this.billingFrom
      })
        .then(res => {
          if (res.code == 0) {
            this.$message.success(res.msg)
            this.$emit('close', 'init')
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    closeBtn() {
      this.$emit('close', '')
    }
  }
}
</script>
<style lang="less" scoped>
.footer {
  .commonBtn,
  .commonBtn1 {
    width: 130px;
  }
  text-align: center;
  margin-top: 36px;
}
.from_wrap {
  display: flex;
  .treminal_from {
    width: 50%;
  }
}
.commonFrom {
  // margin-top: 7px;
  width: 100%;
  .el-form-item {
    width: 50% !important;
    margin-bottom: 7px !important;
  }
  .form-item {
    width: 100% !important;
    /deep/.el-form-item__content {
      display: flex;
    }
    .el-input {
      width: 260px;
    }
  }

  .performance_text {
    color: #999;
    font-size: 14px;
  }
  .icon-guanbianniu {
    font-size: 16px;
    cursor: pointer;
    margin-left: 10px;
  }
  .icon-guanbianniu:hover {
    color: #fa7355;
  }
}
</style>
